<script setup lang="ts">
import { ref, onMounted } from 'vue'
import { useRoute } from 'vue-router'

import ArticleComponent from "@/components/ArticleComponent.vue";
import axios from "axios";

// 路由
const route = useRoute();
// 获取文章id
const articleId = ref( route.params.id || '' );
// 获取关键词
const searchKeyword = ref( route.query.kw || '' );



/**
 * 获取文章列表
 * @param keyword 关键词
 */
const fetchArticleList = async (keyword: string) => {
  try {
    const response = await axios.get(`/api/website/articleList?kw=${keyword}`);
    console.log(response.data);
  } catch (error) {
    console.error('获取文章列表失败:', error);
  }
}

onMounted( () => {
  console.log( 'route.name', route.name );
} );
</script>

<template>
  <template v-if="articleId">
    <ArticleComponent :id="`${articleId}`" :title="'标题'"></ArticleComponent>
  </template>

  <template v-else>
    <div>
      文章列表
    </div>
  </template>
  
</template>

<style scoped>

</style>